<template>
    <el-table :data="tableData" v-loading="tableLoading" border style="width: 100%">
        <el-table-column v-for="item in columns" :prop="item.prop" :label="item.label" :width="item.width" :align="item.align?item.align:'center'">

        <template v-slot="{row}">
            <slot :name="item.prop" :row="row">
            {{getProp(row,item)}}
            </slot> 


        </template>
        </el-table-column>

 

    </el-table>
</template>
<script setup>
// 处理传递的属性名是xxx[0].xx
let getProp=(row,item)=>{
    let reg=/^(.+)\[(\d+)]\.?(.*)$/
    let matched=item.prop.match(reg)
    if(matched){
        let arr=row[matched[1]]
        let prop=arr[matched[2]]
        let prop2=prop[matched[3]]
        return prop2
    }
    return row[item.prop]
}




// 定义表格的属性
let props = defineProps({
    "tableData": {
        type: Array
    },
    "columns": {
        type: Array
    }, 
    "tableLoading": {
        type: Boolean,
        default() {
            return false
        }
    },
  
})


</script>